<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<meta charset="utf-8">
<head th:include="include :: header"></head>
<link th:href="@{/mayioa/css/mayioa-ui.css}" rel="stylesheet"/>
<link th:href="@{/ajax/libs/datapicker/datepicker3.css}" rel="stylesheet"/>
<link th:href="@{/ajax/libs/layui/css/layui.css}" rel="stylesheet"/>
<body class="white-bg">
	<div class="wrapper wrapper-content animated fadeInRight ibox-content">
		<form class="form-horizontal m" id="form-hc-edit" th:object="${hcInfo}">
			<div class="form-group">
				<label class="col-sm-3 control-label ">HC编号：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text"  name="hcId" readonly="true" th:field="*{hcId}"/>
				</div>
			</div>
			<div class="form-group" id="completeStatusDiv">
				<label class="col-sm-3 control-label">完成状态：</label>
				<div class="col-sm-8">
					<select id="completeStatus" class="form-control m-b" th:field="*{completeStatus}" th:with="type=${@dict.getType('recruit_status')}">
						<option th:each="dict : ${type}" th:unless="${dict.dictValue} eq '0'" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" ></option>
					</select>
				</div>
			</div>
			<div class="form-group" id="wbCodeDiv">
				<label class="col-sm-3 control-label">外包编号：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text" name="wbCode"  id="wbCode" th:field="*{wbCode}">
				</div>
			</div>
			<div class="form-group" id="candidateNameDiv">
				<label class="col-sm-3 control-label">候选人姓名：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text" name="candidateName" id="candidateName" th:field="*{candidateName}">
				</div>
			</div>
			<div class="form-group" id="confirmHwLevelDiv">
				<label class="col-sm-3 control-label">定级级别：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text" name="confirmHwLevel" id="confirmHwLevel" th:field="*{confirmHwLevel}">
				</div>
			</div>
			<div class="col-md-12" id="consumeDatelDiv">
				<div class="form-group">
					<label class="col-sm-3 control-label">到位时间：</label>
					<div class="col-sm-8">
						<div class="form-group">
							<div class="input-group date"> <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
								<input type="text" id="consumeDate" name="consumeDate" class="form-control" readonly="true" th:value="*{consumeDate}">
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="form-group" id="gooseDiv">
				<label class="col-sm-3 control-label">Goose截图：</label>
				<div class="col-sm-8">
					<button type="button" class="btn btn-success" id="chooseGoose">选择Goose文件</button>
					<button type="button" class="btn btn-success" id="uploadGoose">开始上传</button>
					<input class="form-control" type="text"  name="goosePath"  readonly="true" id="goosePath" th:field="*{goosePath}">
					<div id="appenDemo"></div>
					<div id="demoText"></div>
					<div>
						<img id="gooseFileShow" th:src="${gooseFileShow}" style="">
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">项目经理：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text" name="isoftPm" id="isoftPm" th:field="*{isoftPm}">
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">PDU：</label>
				<div class="col-sm-8">
					<select id="pdu"  name="pdu" class="form-control m-b"  th:field="*{pdu}" th:with="type=${@dict.getType('human_pdu')}">
						<option th:each="dict : ${type}" th:unless="${dict.dictValue} eq '0'" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">考核单元：</label>
				<div class="col-sm-8">
					<select id="checkPdu"  name="checkPdu" class="form-control m-b" th:field="*{checkPdu}"   th:with="type=${@dict.getType('check_unit')}">
						<option th:each="dict : ${type}" th:unless="${dict.dictValue} eq '0'" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">考核单元负责人：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text" name="checkPduOwner" id="checkPduOwner" th:field="*{checkPduOwner}">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">备注：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text" name="remark" id="remark" th:field="*{remark}">
				</div>
			</div>

		</form>
	</div>
	<div th:include="include::footer"></div>
	<script th:src="@{/ajax/libs/select/select2.js}"></script>
	<script th:src="@{/js/jquery-ui-1.10.4.min.js}"></script>
	<script th:src="@{/ajax/libs/iCheck/icheck.min.js}"></script>
	<script th:src="@{/ajax/libs//datapicker/bootstrap-datepicker.js}"></script>
	<script th:src="@{/ajax/libs/beautifyhtml/beautifyhtml.js}"></script>
	<script th:src="@{/ajax/libs/layui/lay/modules/upload.js}"></script>

	<script>
		var defaultCheckPdu = '[[${hcInfo.checkPdu}]]';
		if (defaultCheckPdu === '') {
			$("#checkPdu").val('');
		}
		var defaultPdu = '[[${hcInfo.pdu}]]';
		if (defaultPdu === '') {
			$("#pdu").val('');
		}
		 $("#consumeDate").datepicker({
			todayBtn: "linked",
			keyboardNavigation: !1,
			forceParse: !1,
			calendarWeeks: !0,
			autoclose: !0
		});

		changeCompleteStatus($("#completeStatus option:selected").val());

 		$("#completeStatus").change(function(){
 			changeCompleteStatus($(this).val());
         });

        $("#form-hc-edit").validate({
        	rules:{
        		completeStatus:{
        			required:true
        		},
        		isoftPm:{
        			required:true
        		},
        		pdu:{
        			required:true
        		},
        		checkPdu:{
        			required:true
        		},
        		checkPduOwner:{
        			required:true
        		}
        	},
        	messages: {
        		"wbCode": {
                    remote: "外包编码不能为空"
                }
            },
        	submitHandler:function(form){
        		submitHandler();
        	}
        });
        
        function submitHandler() {
	        if ($.validate.form()) {
	        	edit();
	        }
	    }

		function changeCompleteStatus(status){
			$("#wbCodeDiv").hide();
			$("#candidateNameDiv").hide();
			$("#confirmHwLevelDiv").hide();
			$("#consumeDatelDiv").hide();
			$("#gooseDiv").hide();
			if(status=="1"||status=="4"){
				$("#wbCodeDiv").show();
				$("#candidateNameDiv").show();
				$("#confirmHwLevelDiv").show();
				$("#consumeDatelDiv").show();
				$("#gooseDiv").show();
             }
		}
        function edit() {
        	var hcId = $("input[name='hcId']").val();
        	var wbCode = $("input[name='wbCode']").val();
        	var candidateName = $("input[name='candidateName']").val();
        	var completeStatus = $("#completeStatus option:selected").val();
        	var isoftPm = $("input[name='isoftPm']").val();
        	var confirmHwLevel = $("input[name='confirmHwLevel']").val();
        	var consumeDate = $("input[name='consumeDate']").val();
        	var checkPduOwner = $("input[name='checkPduOwner']").val();
			var checkPdu = $("#checkPdu option:selected").val();
			var remark = $("input[name='remark']").val();
			var goosePath = $("input[name='goosePath']").val();
        	$.ajax({
        		cache : true,
        		type : "POST",
        		url : ctx + "human/hc/edit",
        		data : {
        			"hcId": hcId,
        			"wbCode": wbCode,
        			"candidateName": candidateName,
        			"completeStatus": completeStatus,
        			"isoftPm": isoftPm,
        			"confirmHwLevel": confirmHwLevel,
        			"consumeDate": consumeDate,
        			"checkPduOwner": checkPduOwner,
        			"checkPdu": checkPdu,
        			"goosePath": goosePath,
        			"remark": remark
        		},
        		async : false,
        		error : function(request) {
        			$.modal.alertError("系统错误");
        		},
        		success : function(data) {
        			$.operate.saveSuccess(data);
        		}
        	});
        }

        layui.use('upload', function(){
          var $ = layui.jquery
          ,upload = layui.upload;

          //普通图片上传
          var uploadInst = upload.render({
            elem: '#chooseGoose'
            ,url: '/human/hc/uploadfile'
            ,auto: false//不自动上传
            ,bindAction: '#uploadGoose'
            ,acceptMime: '.png'
            ,data: {hcId: $("input[name='hcId']").val()}
            ,choose: function (obj) {
               //将每次选择的文件追加到文件队列
                var files = obj.pushFile();
               //预读本地文件，如果是多文件，则会遍历
                obj.preview(function (index, file, result) {
                	$('#appenDemo').empty();
                    $('#goosePath').val(file.name);  //展示文件名
                    $('#appenDemo').append('<div class="image-container" id="container'+index+'">' +
                                '<img id="showImg'+index+'" style="width: 150px;cursor:pointer;"src="' + result + '" alt="' + file.name + '"></div>');

	                //图片放大预览
	                $("#showImg"+index).bind('click',function () {
	                    var bigH = 400;
	                    var bigW = 400;
	                    layer.open({
	                        type: 1,
	                        title: false,
	                        closeBtn: 1,
	                        shadeClose: true,
	                        area: [bigW + 'px', bigH + 'px'], //宽高
	                        content: "<img width='"+bigW+"' height='"+bigH+"' src=" + result + " />"
	                    });
	                });
                })
            }
            ,done: function(res){
              //如果上传失败
              if(res.code < 0){
                return layer.msg(res.msg);
              } else{
                  $('#demoText').empty();
                  $('#goosePath').val(res.msg);  //展示文件名
                  return layer.msg("操作成功");
              }
              //上传成功
            }
            ,error: function(){
              //上传失败，实现重传
              var demoText = $('#demoText');
              demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
              demoText.find('.demo-reload').on('click', function(){
                uploadInst.upload();
              });
            }
          });
    });
    </script>
</body>
</html>
